<template>
  <div class="page-programme-main">
    <div class="center">
      <ProBanner :proInsuranceInfo="proInsuranceInfo" />
    </div>
    <!-- 业务模式 -->
    <ProBusiness :proInsuranceInfo="proInsuranceInfo" />
    <!-- 服务优势 -->
    <ProAdvantag
      :proInsuranceInfo="proInsuranceInfo"
      :proAdvantageList="proAdvantageList"
    />
    <!-- 服务案例 -->
    <ProCase :proInsuranceInfo="proInsuranceInfo" :caseList="caseList" />
  </div>
</template>

<script>
import { ProgrammeApi } from "@/api/api";
import ProBanner from "./components/ProBanner.vue";
import ProBusiness from "./components/ProBusiness.vue";
import ProAdvantag from "./components/ProAdvantag.vue";
import ProCase from "./components/ProCase.vue";
export default {
  name: "Programme",
  components: { ProBanner, ProBusiness, ProAdvantag, ProCase },
  data() {
    return {
      proInsuranceInfo: {},
      proAdvantageList: [],
      caseList: [],
    };
  },
  mounted() {
    this.getProList();
  },
  methods: {
    getProList() {
      ProgrammeApi.programmeList().then((res) => {
        const { proInsuranceInfo, proAdvantageList, caseList } = res.data;
        this.proInsuranceInfo = proInsuranceInfo;
        this.proAdvantageList = proAdvantageList;
        this.caseList = caseList;
      });
    },
  },
};
</script>

<style scoped lang="less">
.page-programme-main {
  width: 100%;
  .center {
    background-color: #3880e7;
  }
}
</style>